
import './index.less'
import { tabData } from './type'
import { Input, Select } from '@arco-design/web-react';
import { IconSearch } from '@arco-design/web-react/icon';
import SelectDropdown from './components/select-dropdown'


type TabsType = {
  /** tab数据 */
  tabList: tabData[],
  /** 当前选中值 */
  tabValue?: string | number
  setTabValue?: (e: string | number) => void
}

function Tabs(props: TabsType) {
  const { tabList, tabValue, setTabValue } = props
  return (
    <>
      <div className='tabs-flex'>
        <div className='tabs-box tabs-fl'>
          {
            tabList?.length > 0 && tabList?.map((item, index) => {
              return (
                <div onClick={() => setTabValue?.(item.value)} key={index} className={`${item.value === tabValue ? 'tabs-sel' : 'tabs-del'} tabs-text`}>
                  {item?.name || '--'}
                </div>
              )
            })
          }
        </div>
        <div >
          <Input prefix={<IconSearch />} style={{ width: 350 }} allowClear placeholder='搜索' />;
        </div>
      </div>
    </>
  )
}

export default Tabs